body {
    width: 100vw;
    display: flex;
    background-color: #111;
    justify-content: center;
}
@font-face {
    font-family: "deyihei";
    src: url("../ttf/SmileySans-Oblique.ttf");
  }
  @keyframes inAn {
    0% {
        opacity: 0;
        transform: translateY(6vw);
    }
    60%{
        opacity: 1;
        transform: translateY(0vw);
    }
    100% {
        opacity: 0;
        transform: translateY(-6vw);
    }
  }
  @keyframes infoIn1 {
    0% {
        opacity: 0;
        transform: translateY(6vw);
    }
    100% {
        opacity: 1;
        transform: translateY(0vw);
    }
  }
  
.inAn {
    position: absolute;
    top: 17vw;
    font-family: 'deyihei';
    opacity: 0;
    color: #fff;
    font-size: 6vw;
    font-weight: 700;
    letter-spacing: 0.3vw;

    animation-name: inAn;
    animation-duration: 1s;
    animation-timing-function: linear;
    animation-delay: 0s;
    animation-fill-mode:forwards;
}
.infoBox {
    width: 75vw;
    display: flex;
    align-items: center;
    justify-content: space-around;
    margin-top: 8vw;
}
.BHImg {
    width: 12vw;
}
.hopeImg {
    width: 18vw;
    padding-top: 1vw;
   
    
}
.juniorImg {
    width: 17vw;
    margin-top: 5vw;
}
.juniorImg,
.hopeImg,
.BHImg {
    opacity: 0;
    animation-name: infoIn1;
    animation-duration: 0.6s;
    animation-timing-function: ease-in-out;
    animation-delay: 0.8s;
    animation-fill-mode:forwards;
}
.imgBox {
    height: 14vw;
}
.info {
    color: #fff;
    font-size: 1.4vw;
    font-weight: 700;
   
    font-family: 'deyihei';
    margin: 0.6vw 0;

    opacity: 0;
    animation-name: infoIn1;
    animation-duration: 0.6s;
    animation-timing-function: ease-in-out;
    
    animation-fill-mode:forwards;
}
.infoItem {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.info1,.info2,.info3 {
   margin-left: 5vw;
}
.group1 {
    animation-delay: 1.2s;
}
.group2 {
    animation-delay: 1.4s;
}
.group3 {
    animation-delay: 1.6s;
}
.group4 {
    animation-delay: 1.8s;
}